<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登录</title>
    <script src="jquery-1.9.1.min.js"></script>
    <script>
        function mysub(type){
            var username = jQuery("#username");
            var password = jQuery("#password");
            if(type == 2){
                // 清空操作
                if (confirm("确认清空?")) {
                    username.val("");
                    password.val("");
                    password2.val("");
                }
                return false;
            }
            //非空校验
            if(username.val().trim() == ""){
                alert("请先输入用户名！");
                username.focus();
                return  false;
            }
            if(password.val().trim() == ""){
                alert("请先输入密码！");
                password.focus();
                return  false;
            }
            //2.请求后端，实现登录验证
            jQuery.getJSON("login",{
                "username":username.val(),
                "password":password.val()
            },function(data){
                if(data != null && data.succ == 1){
                    //登录成功
                    // alert("恭喜：登录成功！");
                    //登录成功之后，进行页面跳转，跳转到文章列表页
                    location.href = "myartlist.html";
                }else{
                    alert("登录失败:输入用户名或者密码错误！" + data.msg);
                }
            });

        }
    </script>
</head>
<body>
    <div style = "margin-top: 70px;text-align: center;">
        <h1>登录功能</h1>
        用户名：<input id = "username",name = "username",type = "text"><p></p>
        密&nbsp;&nbsp;码：<input id = "password" name = "password" type = "password"><p></p>
        <input type = "button" onclick = "mysub(1)" value = "提交">
        <input type = "button" onclick = "mysub(2)" value = "清空">
    </div>
</body>
</html>